$(function(){
    
    //初始化数据
    init();

    //添加按钮点击事件
    $("#addButton").click(function(){
        //$("#gwc").append($("#product1").prev().clone(true));
        //$("#gwc").append($("#product1").clone(true));

        $("#gwc").append(`<tr>
            <td colspan="8" class="shopInfo">店铺：<a href="#">纤巧百媚时尚鞋坊</a>    卖家：<a href="#">纤巧百媚</a> <img src="images/taobao_relation.jpg" alt="relation" /></td>
        </tr>
        <tr id="product1">
            <td class="cart_td_1"><input name="cartCheckBox" type="checkbox" value="product1"/></td>
            <td class="cart_td_2"><img src="images/taobao_cart_01.jpg" alt="shopping"/></td>
            <td class="cart_td_3"><a href="#">日韩流行风时尚美眉最爱独特米字拼图金属坡跟公主靴子黑色</a><br />
                颜色：棕色 尺码：37<br />
                保障：<img src="images/taobao_icon_01.jpg" alt="icon" /></td>
            <td class="cart_td_4">5</td>
            <td class="cart_td_5">138.00</td>
            <td class="cart_td_6"><img src="images/taobao_minus.jpg" alt="minus" class="hand" onclick="numMinus(this)"/><input id="num_1" type="text"  value="2" class="num_input" readonly="readonly"/><img src="images/taobao_adding.jpg" alt="add" class="hand" onclick="numAdd(this)"/></td>
            <td class="cart_td_7"></td>
            <td class="cart_td_8"><a href="javascript:void(0);" class="mydel" >删除</a></td><!--onclick="deleteRow(this)"-->
        </tr>`);

        init();
    })

    //删除按钮点击事件
    //$(".mydel").click(function(){
    $(".mydel").live("click",function(){
    // $(".mydel").on("click",function(){
        $(this).parent().parent().prev().remove();
        $(this).parent().parent().remove();
        init();
    })
})

//读取数据并渲染
function init(){
    //获取单价、积分、数量、小计
    var $priceArr = $(".cart_td_5");
    var $scoreArr = $(".cart_td_4");
    var $numArr = $(".cart_td_6").children("input");
    var $xjArr = $(".cart_td_7");
    //总积分
    var zjf=0;
    //总价
    var zj=0;
    //遍历单价数组
    $priceArr.each(function(index,element){
        //每个
        //console.log($(element).text(), $scoreArr.eq(index).text(), $numArr.eq(index).val());
        //每件商品单价
        var dj = $(element).text();
        //每件商品积分
        var jf = $scoreArr.eq(index).text();
        //每件商品数量
        var sl = $numArr.eq(index).val();
        //计算小计
        $xjArr.eq(index).text(dj * sl);
        //计算总积分
        zjf += $scoreArr.eq(index).text() * sl;
        //计算总计
        zj += dj * sl;
    });
    //渲染
    $("#total").text(zj);
    $("#integral").text(zjf);
}